<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <title>忧郁小王子-文章分类</title>
  <link rel="stylesheet" href="/admin/assets/vendors/bootstrap/css/bootstrap.css">
  <link rel="stylesheet" href="/admin/assets/vendors/font-awesome/css/font-awesome.css">
  <link rel="stylesheet" href="/admin/assets/vendors/nprogress/nprogress.css">
  <link rel="stylesheet" href="/admin/assets/css/admin.css">
  <script src="/admin/assets/vendors/nprogress/nprogress.js"></script>
</head>
<body>
  <script>NProgress.start()</script>

  <div class="main">
    {{include '../common/header.html'}}
    <div class="container-fluid">
      <div class="page-title">
        <h1>文章分类</h1>
      </div>
      <!-- 有错误信息时展示 -->
      <!-- <div class="alert alert-danger">
        <strong></strong>
      </div>-->
      <div class="row">
        <div class="col-md-4">
          <form method="post" action="/admin/addCategory">
            <h2>添加文章分类</h2>
            <div class="form-group">
              <label>名称</label>
              <input id="classify" name="title" class="form-control" type="text" placeholder="请输入分类名称">
            </div>
            <div class="form-group">
              <button onclick="return check()" class="btn btn-primary" type="submit">添加</button>
            </div>
          </form>
        </div>
        <div class="col-md-8">
          <!-- <div class="page-action">
            <a class="btn btn-danger btn-sm" href="javascript:;">批量删除</a>
          </div> -->
          <table class="table table-striped table-bordered table-hover">
            <thead>
              <tr>
                <th class="text-center" width="40"><input type="checkbox"></th>
                <th class="h4 text-center">文章分类名称</th>
                <th class="text-center h4" width="200">操作</th>
              </tr>
            </thead>
            <tbody>
            {{each category}}
              <tr>
                <td class="text-center"><input type="checkbox"></td>
                <td class="text-center">{{$value.title}}</td>
                <td class="text-center">
                  <a href="/admin/toModifyClassifyPage?id={{@$value._id}}" class="btn btn-warning btn-xs">修改</a>
                  <a href="javascript:;" class="btn btn-danger btn-xs" onclick="javascript:if(del()) location.href='/admin/deleteCategory?id={{@$value._id}}'">删除</a>
                </td>
              </tr>
            {{/each}}
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>

  {{include '../common/leftMenu.html'}}
  <script src="/admin/assets/vendors/jquery/jquery.js"></script>
  <script src="/admin/assets/vendors/bootstrap/js/bootstrap.js"></script>
  <script>
    NProgress.done();
    function check(event){
      let classifyValue = $('#classify').val();
      if(classifyValue == ''){
        alert('分类名称不能为空！！！');
        return false;
      }else if(classifyValue.length < 2 || classifyValue.length > 15){
        alert('分类名称长度为2-15之间！！！');
        return false;
      }
      else{
        return true;
      }
    }
    function del(){
      let message = confirm("您确定要删除该改用户吗？");
      if (message == true){
        return true;
      }else{
        return false;
      }
    }
  </script>
</body>
</html>
